<template>
  <el-container id="main">
    <!-- 左侧导航 -->
    <el-aside width="auto">
      <Navigation/>
    </el-aside>
    <!-- 右侧区域 -->
    <el-container>
      <!-- 右侧头部 -->
      <el-header class="head">
        <Header/>
      </el-header>
      <CommonTags/>
      <!-- 右侧内容区 -->
      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>
  </el-container>
</template>

<script>
import Header from "@/components/Header"
import Navigation from '@/components/Navigation'
import CommonTags from '@/components/CommonTags'
export default {
  name:'Main',
  components:{
    Navigation,
    Header,
    CommonTags
  }

}
</script>

<style lang='less' scoped>
  #main{
    .el-main{
      padding-top: 10px;
    }
    .head{
      background-color: #555;
    }
  }

</style>